<template>
  <PageWrapper>
    <a-button @click="handleClick">打开抽屉</a-button>
    <a-button @click="handleClickRef">打开抽屉Ref</a-button>
    <UserFormDrawer @register="register" />
    <UserFormDrawerRef ref="userFormDrawerRef" />
  </PageWrapper>
</template>
<script setup lang="ts">
  import { PageWrapper } from '@/components/Page';
  import { useDrawer } from '@/components/Drawer';
  import UserFormDrawer from './components/UserFormDrawer.vue';
  import UserFormDrawerRef from './components/UserFormDrawerRef.vue';
  import { ref } from 'vue';

  const userFormDrawerRef = ref();
  const [register, { openDrawer }] = useDrawer();
  const handleClick = () => {
    openDrawer(true, {
      userName: 'admin',
      // realName: '张三',
    });
  };
  const handleClickRef = () => {
    userFormDrawerRef.value.show({
      userName: 'admin',
    });
  };
</script>
<style lang="less" scoped></style>
